<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>员工信息管理系统 - 查看员工</title>
    <link rel="stylesheet" type="text/css" href="../css/style.css">
</head>
<body>
<header>
    <div class="logo">员工信息管理系统</div>
    <nav>
        <ul>
            <li><a href="../dashboard.jsp">仪表盘</a></li>
            <li class="active"><a href="list.jsp">员工管理</a></li>
        </ul>
    </nav>
    <div class="user-info">
        <span>欢迎, ${user.username}</span>
        <a href="../LogoutServlet" class="logout-btn">退出</a>
    </div>
</header>

<main>
    <div class="content-container">
        <div class="content-header">
            <h2>员工详情</h2>
            <div>
                <a href="../EmployeeServlet?action=edit&id=${employee.id}" class="btn secondary">编辑</a>
                <a href="../EmployeeServlet?action=list" class="btn">返回列表</a>
            </div>
        </div>

        <div class="detail-card">
            <div class="detail-header">
                <h3>${employee.name}</h3>
                <p>${employee.department} - ${employee.position}</p>
            </div>

            <div class="detail-body">
                <div class="detail-row">
                    <div class="detail-item">
                        <span class="label">员工ID:</span>
                        <span class="value">${employee.id}</span>
                    </div>
                    <div class="detail-item">
                        <span class="label">薪资:</span>
                        <span class="value"><fmt:formatNumber value="${employee.salary}" type="number" pattern="###,##0.00"/> 元/月</span>
                    </div>
                </div>

                <div class="detail-row">
                    <div class="detail-item">
                        <span class="label">邮箱:</span>
                        <span class="value">${employee.email}</span>
                    </div>
                    <div class="detail-item">
                        <span class="label">电话:</span>
                        <span class="value">${employee.phone}</span>
                    </div>
                </div>

                <div class="detail-row">
                    <div class="detail-item">
                        <span class="label">入职日期:</span>
                        <span class="value"><fmt:formatDate value="${employee.hireDate}" pattern="yyyy年MM月dd日"/></span>
                    </div>
                    <div class="detail-item">
                        <span class="label">创建时间:</span>
                        <span class="value"><fmt:formatDate value="${employee.createdAt}" pattern="yyyy年MM月dd日 HH:mm:ss"/></span>
                    </div>
                </div>

                <div class="detail-row">
                    <div class="detail-item">
                        <span class="label">最后更新:</span>
                        <span class="value"><fmt:formatDate value="${employee.updatedAt}" pattern="yyyy年MM月dd日 HH:mm:ss"/></span>
                    </div>
                </div>
            </div>
        </div>
    </div>
</main>

<footer>
    <p>&copy; 2023 员工信息管理系统</p>
</footer>
</body>
</html>